02.1 精通自定义 View 之视图动画——视图动画标签

返回自定义 View 目录

Animation：
    · View Animation（视图动画，API Level 1）
        · Tween Animation（补间动画）
        · Frame Animation（逐帧动画）
    · Property Animation（属性动画，API Level 11）
        · ValueAnimator
        · ObjectAnimator

2.1.1 概述

视图动画分为 5 种类型组成：
scale：渐变透明度动画效果
alpha：渐变尺寸伸缩动画效果
rotate：画面转移旋转动画效果
translate：画面变化位置移动动画效果
set：定义动画集

1. 配置 XML 动画文件

<?xml version="1.0" encoding="utf-8">
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:duration="700"

2. 动画文件存放位置

存放在 res/anim 文件夹下，访问时使用 R.anim.XXX。
存放在 res/drawable 文件夹下，访问时使用 R.drawable.XXX。

3. 使用动画文件

1
2
3

View view = findViewById(R.id.view);
Animation animation = AnimationUtils.loadAnimation(this, R.anim.scale_anim);
view.startAnimation(animation);

2.1.2 scale 标签

scale 标签用于缩放动画，可以实现动态调整控件尺寸的效果：

android:fromXScale：动画开始时，控件在 X 轴方向上相对自身的缩放比例，浮点值。1.0 代表自身无变化，0.5 表示缩小一倍，2.0 代表放大一倍。
android:toXScale：动画结束时，控件在 X 轴方向上相对自身的缩放比例，浮点值。
android:fromYScale：动画开始时，控件在 Y 轴方向上相对自身的缩放比例，浮点值。
android:toYScale：动画结束时，控件在 Y 轴方向上相对自身的缩放比例，浮点值。
android:pivotX：缩放起始点 X 轴坐标。是数值如 50，则表示在当前控件的左上角原点 X 轴坐标 + 50px，作为缩放起始点 X 轴坐标；是百分数如 50%，则表示在当前控件的左上角原点 X 轴坐标 + 自身宽度的 50%，作为缩放起始点 X 轴坐标；是百分数 p 如 50%p，则表示在当前控件的左上角原点 X 轴坐标 + 父控件宽度的 50%，作为缩放起始点 X 轴坐标；
android:pivotY：缩放起始点 Y 轴坐标。取值同上。

示例：
缩放动画 scale1.xml：android:pivotX=”50”

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.0"
    android:fromYScale="0.0"
    android:toYScale="1.0"
    android:pivotX="50"
    android:duration="700"/>

缩放动画 scale2.xml：android:pivotX=”50%”

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.0"
    android:fromYScale="0.0"
    android:toYScale="1.0"
    android:pivotX="50%"
    android:duration="700"/>

缩放动画 scale3.xml：android:pivotX=”50%”

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="0.0"
    android:toXScale="1.0"
    android:fromYScale="0.0"
    android:toYScale="1.0"
    android:pivotX="50%p"
    android:duration="700"/>

2.1.3 Animation 继承属性

所有的动画都继承自 Animation 类，它的内部实现了一些共用的动画属性：

android:duration：一次动画的持续时间，单位毫秒。
android:fillAfter：为 true 表示控件动画结束时，将保持动画结束时的状态。
android:fillBefore：为 true 表示控件动画结束时，将还原到初始化状态。默认为 true。
android:fillEnabled：同 fillBefore。
android:repeatCount：指定动画的重复次数，取值为 infinite 时，表示无限循环。
android:repeatMode：设定重复的类型，有 reverse（倒序回放）和 restart（重放）两个值。与 repeatCount 一起使用才有效果。
android:interpolator：设定插值器，指定动画效果，比如弹跳效果。

2.1.4 alpha 标签

alpha 标签用于实现渐变透明度动画效果。除从 Animation 类继承而来的属性外，自身所具有的属性如下：

android:fromAlpha：动画开始的透明度，取值范围 0.0 ~ 1.0，0.0 表示完全透明，1.0 表示完全不透明。
android:toAlpha：动画结束的透明度，取值范围 0.0 ~ 1.0，0.0 表示完全透明，1.0 表示完全不透明。

示例：

<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.5"
    android:repeatMode="reverse"
    android:repeatCount="infinite"
    android:duration="700"/>

2.1.5 rotate 标签

rotate 标签用于实现画面转移旋转动画效果。除从 Animation 类继承而来的属性外，自身所具有的属性如下：

android:fromDegrees：动画开始旋转时的角度位置，正值代表顺时针方向的度数，负值代表逆时针方向的度数。
android:toDegrees：动画结束时旋转到的角度位置，正值代表顺时针方向的度数，负值代表逆时针方向的度数。
android:pivotX：旋转中心点 X 轴坐标，默认旋转中心点为控件的坐标原点（左上角），可以是数值、百分数、百分数p 三种样式。
android:pivotY：旋转中心点 Y 轴坐标，同上。

示例：

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="180"
    android:pivotX="50%"
    android:pivotY="50%"
    android:repeatMode="restart"
    android:repeatCount="infinite"
    android:duration="700"/>

2.1.6 translate 标签

translate 标签用于实现画面转移旋转动画效果。除从 Animation 类继承而来的属性外，自身所具有的属性如下：

android:fromXDelta：起始点 X 轴坐标，可以是数值、百分数、百分数p。
android:fromYDelta：起始点 Y 轴坐标，同上。
android:toXDelta：终点 X 轴坐标。
android:toYDelta：终点 Y 轴坐标。

示例：

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toXDelta="-50%"
    android:toYDelta="-50%"
    android:duration="1500"/>

2.1.7 set 标签

set 标签是一个容器类标签，用于定义动画集。前面的 4 个标签只能完成特定的功能，而 set 标签则可以把这些动画效果组合起来，共同完成一个动画。set 标签自身没有属性，它的属性都是从 Animation 类继承而来的。当这些属性用于 set 标签时，就会对 set 标签下的所有子控件产生作用。但 repeateCount 属性是无效的，必须对每个动画单独设置才有作用。

示例：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="2000"
    android:fillAfter="true">
    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0"/>
    <scale
        android:fromXScale="0.0"
        android:toXScale="1.4"
        android:fromYScale="0.0"
        android:toYScale="1.4"
        android:pivotX="50%"
        android:pivotY="50%" />
    <rotate
        android:fromDegrees="0"
        android:toDegrees="720"
        android:pivotX="50%"
        android:pivotY="50%"/>
</set>